﻿/*Used for sticky footer*/
* { margin: 0; }
html, body { height: 100%; cursive; width: 100%;}
body {width: 100%; }
#wrapper { min-height: 89%; height: auto !important; width: auto !important; background-color: #FFFFFF; }
footer {height: 2em; margin: -2.1em auto 0; background-color: black; color: white; width: auto !important;}
form  { height: 100%;  }
header {height: 6em; width: auto !important; }
/*Sticky footer end*/




/*NAVIGATION STYLING*/


/*Navigation fluffing*/
nav 
{
    background: -moz-linear-gradient(-90deg, #008000, #00D600);
    background: -webkit-gradient(linear, left top, left bottom, from(#008000), to(#00D600));
    height: 2em;
    border-right: 3px solid #000;
    border-top: 1px solid #000;   
    border-bottom: 2px solid #000;
    border-left: 3px solid #000;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
   
    }

/* BE SURE TO INCLUDE THE CSS RESET FOUND IN THE DEMO PAGE'S CSS */
/*------------------------------------*\
	NAV
\*------------------------------------*/
#nav
{
    margin-top:0;
    height:0;
	list-style:none;
	font-weight:bold;
	
	/* Clear floats */
	float:left;
	width:100%;
	margin-left:-3em;
	/* Bring the nav above everything else--uncomment if needed.*/
	position:relative;
	z-index:5;	
}

nav text { margin-top: -0.5em; }

nav text a:hover { text-shadow: 1px 1px 1px #FFF; }
#nav li
{
    height:2em;
	float:left;	
	position:relative;
	border-right:2px solid #000;	
}
#nav a
{
	display:block;	
	Color: #000;
	height: 1.3em;
	padding:0.3em 0.5em 0 ;		
	margin-left:0.5em;
	text-decoration:none;
	font-family:'Press start 2p';
	font-size: 1.2em;
	border:1px solid #red;
	-webkit-border-radius: 3px;  
    -moz-border-radius-: 3px;
    border-radius: 3px;
   
	
    /*BACKGROUND*/
     background: -moz-linear-gradient(-90deg, #008000, #00D600);
    background: -webkit-gradient(linear, left top, left bottom, from(#008000), to(#00D600));
    

}
#nav a:hover{
	color:#000;
	/*background:#6b0c36;*/		
	text-shadow: 1px 1px 2px #FFF;
}

/*--- DROPDOWN ---*/
#nav ul{
	/*background:#fff; *//* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	/*background:rgba(255,255,255,0);*/ /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	
	list-style:none;
	position:absolute;	
	margin-top:0;
	margin-left:-40%;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li{
	/*padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
	
}
#nav ul a{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
	border:2px solid #000;
}
#nav li:hover ul{ /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
	
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	
	
	text-decoration:none;
}
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
    
	text-decoration:none;
	color:#000;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	
}
/*Logged in user nav bar*/
nav text 
{
    
     color: black;
     float: right;
     font-size: 1em;
     padding-right: 0.5em;
}



/*News feed rendering.. */
#date{margin-top: -1em; }
.newsItem.three-quarters  
{
    border: 1px solid black; 
    }

.newsItem 
{
       margin-bottom: 2%; 
    font-family: 'Press start 2p', cursive;
    border: 1px solid black;
     padding:2em;
    margin-bottom: 2em;
    background-color: #F0F0F0; 
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 5px 5px 7px #008000;
    border: 1px solid #000;
}
.newsItem h4 { text-align: right; font-family: 'Press start 2p'; font-size: 0.6em;} 
.newsItem h6 { text-align: right; font-family: 'Press start 2p'; font-size: 0.6em;} 
.newsItem h5 { font-family:'Press start 2p'; font-size:1em; margin-bottom:1em; margin-top: -2em;}
.newsItem h7 {text-align:right; font-family: Verdana; font-size: 1.2em; }
.newsItem p { font-family: Verdana; font-size: 0.7em;  }   
.newsText 
{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid gray;
    padding: 0.5em 1em 0.5em 1em;
    margin-top:1em;
    background-color:#FFF;
    
    text-align:left;
    }  

      

/*HEADER STYLING*/
header 
{
background-color: white; 
border-bottom: 3px solid #008000;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
background: -moz-linear-gradient(-90deg, #00D600, #008000);
background: -webkit-gradient(linear, left top, left bottom, from(#00D600), to(#008000));


}

h1.insetType 
{
  padding-top:0.5em;
  font-family: 'Press start 2p', Georgia, "Times New Roman", Times, serif;
  font-size: 3em;
  color: #008000; 
  text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.5) 0 1px, rgba(0,0,0,0.3) -1px -2px;
}
}

#logo { height: 100%; padding: 1em; margin-bottom: -0.5em;}
#logo a:link {color: #008000; text-decoration: none; }
#logo a:active {color: #008000; text-decoration: none; }
#logo a:visited {color: #008000; text-decoration: none; }
#logo a:hover {color: #008000; text-decoration: none; }



/*BEGIN RIGHTSIDE NAVIGATION BAR*/

#usersection
{   
    background-color: #F0F0F0;
     -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    box-shadow: 5px 5px 7px #008000;
    border: 1px solid #000;    
    width: 14%;   
}
  

#usersection h3
{
   
    color: black;
    font-family:'Press start 2p';
    font-size: 0.8em;
    font-smooth:auto;
    padding-top: 0.3em;
    }

/*List of courses that the user is in styling*/

.courselistPanel 
{
    margin-left:-30%;
    list-style:none;
     display:block; 
     width: 90%;
     font-size: 0.7em;
     font-family: 'Verdana';
}

.controlPanel
{
    margin-left:-30%;
    list-style:none;
    display:block;
    font-size: 0.6em;   
    font-family: 'Verdana'; 
}

.controlPanel li
{
    border: 1px solid gray;
    margin: 1em 0 1em 0;
    font-weight:bold;
    text-align:center;
    border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;     
}

.controlPanel li:hover 
{
     border: 1px solid green;
     box-shadow: 2px 2px 5px #008000;
}


#maincontent {margin-top: 1em; min-height: 100%; height: auto! important; border-left: 1px solid grey; border-right: 1px solid grey; }
#maincontent h2 {margin-bottom: 1em; }
#contentsection {margin-left: 1em; }



/*Footer styling*/
footer  
{
    margin-top:1em;
    border-top: 3px solid #008000;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px; }
footer p {display: inline; margin-right: 1em; font-size: 9px; color: white;}
#social {float: right; }
#social p {color: green; font-size: 15px; }

/*Link styling*/
a:link  
{
   
    text-decoration: none; 
    color: Black;   
}

a:visited  
{
    
    text-decoration: none;    
    color: Black; 
}

a:hover  
{
   
    text-decoration: none;    
    color: Black; 
}

a:active  
{
    
    text-decoration: none;    
    color: Black; 
}

/*VALIDATION ERRORS*/


.validation-message {font-size: 0.6em; color: Red; }

.field-validation-error {font-size: 0.6em; color: Red; }